<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Yu-Gi-Oh!</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="jquery.min.js"></script>
<script>if (typeof module === 'object') {window.jQuery = window.$ = module.exports;};</script>
</head>
<body ondragstart="return false;" oncontextmenu="return false;">
	<div id="button1" style="position:fixed;bottom:10px;left:10px;width:100px;height:100px;cursor:pointer" onclick="summon('my_monster_1','my_hand_card_2','attack')"></div>
	<div id="button2" style="position:fixed;bottom:10px;left:130px;width:100px;height:100px;cursor:pointer" onclick="attack('my_monster_4','enemy_monster_2')"></div>
	<div id="button3" style="position:fixed;bottom:10px;left:250px;width:100px;height:100px;cursor:pointer" onclick="video('img2/blue.mp4')"></div>
	<div id="button4" style="position:fixed;bottom:10px;left:370px;width:100px;height:100px;cursor:pointer" onclick="set_card('my_cover_3','my_hand_card_1')"></div>
	<!--阶段选择-->
	<div class="step_box" id="step_box">
		<div class="steps">M1</div>
		<div class="steps" onclick="attack_step();ContextMenu()">BP</div>
		<div class="steps" onclick="main_step_2();ContextMenu()">M2</div>
		<div class="steps" onclick="auto_step_2();ContextMenu()">EP</div>
	</div>
	<!--消息盒子-->
	<div class="msg_boxs" id="msg_boxs" onclick="change_size()" onmouseover="this.style.transform='translate(-10px,0px)'" onmouseout="this.style.transform='translate(0px,0px)'"><nobr><p id="msg" style="position:relative;top:-3px">决斗开始！</p></nobr></div>
	<div id="dark" class="dark"></div>
	<img id="test" src="img/margin.png">
	<script>
		var margin_src=document.getElementById("test").src;
	</script>
	<!--bgm-->
	<audio src="img2/arranged.mp3" style="position:fixed;top:10px;left:10px" id="bgm_box">
		Your browser does not support the audio element.
	</audio>
	<div class="move_box" id="move_box"></div>
	<!--大图-->
	<nobr><div id="max_img_box" class="max_img"></div></nobr>
	<!--生命值-->
	<div id="aaa" class="aaa"></div>
	<div id="my_life_box" style="width:30px;height:350px;position:fixed;top:52%;right:20px;background-color:#fff;border-radius:13px;z-index:-999"></div>
	<div id="bbb" class="bbb"></div>
	<div id="enemy_life_box" style="width:30px;height:350px;position:fixed;bottom:52%;right:20px;background-color:#fff;border-radius:13px;z-index:-999"></div>
	<!--决斗场区域-->
	<div id="background" style="width:100%;height:100%;position:absolute;top:0px;left:0px;background-image:url('img2/background.jpg');background-position:center bottom;background-attachment: fixed;background-size: cover;">
		<div style="position:absolute;top:50%;left:50%;width:260px;height:450px">
			<div style="width:260px;height:450px;position:relative;top:-80px;left:-665px;overflow:hidden;border-radius:20px;">
				<div style="position:absolute;top:-50px;left:-50px;background-image:url('img2/background.jpg');background-position: center bottom;background-attachment: fixed;background-size: cover;filter:blur(20px);-webkit-filter:blur(20px);width:400px;height:600px;overflow:hidden;"></div>
			</div>
		</div>
	</div>
	<div id="duel" class="duel">
		<div style="width:1050px;height:750px;position:absolute;top:0px;right:0px;border-radius:20px;box-shadow:10px 10px 50px #000;z-index:-9999999;opacity:0.5"></div>
		<div style="width:1050px;height:750px;position:absolute;top:0px;right:0px;border-radius:20px;z-index:-9999999;background:url('');background-color:#fff;opacity:0.1"></div>
		<div id="duel_desk" style="width:1050px;height:750px;position:absolute;top:0px;right:0px;border-radius:20px;z-index:-999999">
			<!--卡片列表查看器-->
			<div class="step_box" id="card_list" style="width:1013px;transform:translate(-50%,-50%);left:50%;border-left:solid 20px #ccc;border-right:solid 20px #ccc;border-radius:20px;"></div>
			<!--menu-->
			<div id="reset_menu"></div>
			<!--敌方手卡-->
			<div class="hand_card" style="top:-100px">
				<div style="margin-left:5px;margin-right:5px"><img id="hand_card_1" src="img/cover.jpg" class="card" onmouseover="this.style.transform='scale(1.2,1.2)',interview('hand_card_1')" onmouseout="this.style.transform='scale(1,1)'" ></div>
				<div style="margin-left:5px;margin-right:5px"><img id="hand_card_2" src="img/cover.jpg" class="card" onmouseover="this.style.transform='scale(1.2,1.2)',interview('hand_card_2')" onmouseout="this.style.transform='scale(1,1)'"></div>
				<div style="margin-left:5px;margin-right:5px"><img id="hand_card_3" src="img/cover.jpg" class="card" onmouseover="this.style.transform='scale(1.2,1.2)',interview('hand_card_3')" onmouseout="this.style.transform='scale(1,1)'"></div>
			</div>
			<!--我方手卡-->
			<div class="hand_card" style="top:550px" id="my_hand"><div id="my_hand_card_1" class="hand_box" onclick="click_ansys('my_hand_card_1')"><img id="h_42664989_1" src="img/42664989.jpg" class="card_hand" onmouseover="interview('42664989')"></div><div id="my_hand_card_2" class="hand_box" onclick="click_ansys('my_hand_card_2')"><img id="h_73665146_2" src="img/73665146.jpg" class="card_hand" onmouseover="interview('73665146')"></div></div>
			<!--卡组区域-->
			<div style="position:absolute;bottom:25px;right:20px;box-shadow:10px 10px 50px #000;width:100px;height:150px"></div>
			<div style="position:absolute;bottom:20px;right:20px;"><img src="img/cover.jpg" class="card"></div>
			<div id="reset"><div style="position:absolute" class="my_desk" id="my_desk" onmouseover="my_desk.style.bottom='0px';" onmouseout="my_desk.style.bottom='20px'"><img src="img/cover.jpg" class="card"></div></div>
			<div style="position:absolute;bottom:25px;left:20px;box-shadow:5px 5px 30px #000;width:100px;height:150px;opacity:0.8;z-index:99;cursor:pointer;" onclick="card_list(myself.out_list,0)"></div>
			<div style="position:absolute;bottom:20px;left:20px;"><img src="img/cover.jpg" class="card"></div>
			<div style="position:absolute;top:20px;right:20px;box-shadow:5px 5px 30px #000;width:100px;height:150px;opacity:0.8"></div>
			<div style="position:absolute;top:20px;right:20px;"><img src="img/cover.jpg" class="card"></div>
			<div style="position:absolute;top:20px;left:20px;box-shadow:10px 10px 50px #000;width:100px;height:150px;opacity:0.8"></div>
			<div style="position:absolute;top:20px;left:20px;"><img src="img/cover.jpg" class="card"></div>
			<!--墓地区域-->
			<div style="position:absolute;bottom:180px;right:20px" id="my_cemetery" onclick="card_list(myself.cemetery_list,0)"><img id="cemetery" src="img/margin.png" class="card" style="box-shadow:0px 0px 0px #777"></div>
			<div style="position:absolute;top:180px;left:20px;transform:rotate(180deg);" id="enemy_cemetery" onclick="card_list(enemy.cemetery_list,0)"><img id="cemetery2" src="img/margin.png" class="card" style="box-shadow:0px 0px 0px #777"></div>
			<!--敌方怪兽-->
			<div style="width:550px;height:150px;position:absolute;bottom:385px;left:120px;text-align:center;transform:rotate(180deg);">
				<div id="enemy_monster_1" class="card_box" style="left:-225px"></div>
				<div id="enemy_monster_2" class="card_box" style="left:-65px"><img id="e_46986414_2" src="img/46986414.jpg" class="card" onmouseover="interview('46986414'),this.style.border='2px solid #fff';" onmouseout="this.style.border='0px solid #fff';"></div>
				<div id="enemy_monster_3" class="card_box" style="left:95px"><img id="e_89631139_3" src="img/89631139.jpg" class="card" onmouseover="interview('89631139'),this.style.border='2px solid #fff';" onmouseout="this.style.border='0px solid #fff';"></div>
				<div id="enemy_monster_4" class="card_box" style="left:255px"></div>
				<div id="enemy_monster_5" class="card_box" style="left:415px"></div>		
			</div>
			<!--我方怪兽-->
			<div style="width:810px;height:150px;position:absolute;top:385px;left:130px;text-align:center;z-index:99999" id="my_monster">
				<div id="my_monster_1" class="card_box" style="left:25px"><img id="m_38033121_1" src="img/38033121.jpg" class="card" onmouseover="interview('38033121');if (summon_state==0){this.style.border='2px solid #fff';}" onmouseout="if (summon_state==0){this.style.border='0px solid #fff';}"><div class="at_df">2000 1700</div></div>
				<div id="my_monster_2" class="card_box" style="left:185px"></div>
				<div id="my_monster_3" class="card_box" style="left:345px"><img id="m_23995346_3" src="img/23995346.jpg" class="card" onmouseover="interview('23995346');if (summon_state==0){this.style.border='2px solid #fff';}" onmouseout="if (summon_state==0){this.style.border='0px solid #fff';}"><div class="at_df">4500 3800</div></div>
				<div id="my_monster_4" class="card_box" style="left:505px"></div>
				<div id="my_monster_5" class="card_box" style="left:665px"></div>		
			</div>
			<!--我方盖牌-->
			<div style="width:550px;height:150px;position:absolute;top:540px;left:130px;text-align:center">
				<div id="my_cover_1" class="card_box" style="left:25px"><img id="t_01637760" src="img/cover.jpg" class="card" onmouseover="interview('01637760'),this.style.border='2px solid #fff';" onmouseout="this.style.border='0px solid #fff';"></div>
				<div id="my_cover_2" class="card_box" style="left:185px"></div>
				<div id="my_cover_3" class="card_box" style="left:345px"></div>
				<div id="my_cover_4" class="card_box" style="left:505px"></div>
				<div id="my_cover_5" class="card_box" style="left:665px"></div>
			</div>
			<!--敌方盖牌-->
			<div style="width:790px;height:150px;position:absolute;bottom:540px;left:140px;text-align:center;transform:rotate(180deg);">
				<div id="enemy_cover_1" class="card_box" style="left:25px"><img id="01637760" src="img/cover.jpg" class="card" onmouseover="interview('01637760'),this.style.border='2px solid #fff';" onmouseout="this.style.border='0px solid #fff';"></div>
				<div id="enemy_cover_2" class="card_box" style="left:185px"></div>
				<div id="enemy_cover_3" class="card_box" style="left:345px"></div>
				<div id="enemy_cover_4" class="card_box" style="left:505px"></div>
				<div id="enemy_cover_5" class="card_box" style="left:665px"></div>			
			</div>
		</div>
		<!--详细展示区域-->
		<div style="position:absolute;width:260px;height:750px;top:0px;left:0px;background:inherit;">
			<div id="interview_box" style="width:177px;height:254px;position:absolute;top:0px;text-align:center;">
				<img id="interview_img" src="img/cover.jpg" style="width:177px;height:254px;position:absolute;top:0px;left:41.5px;transition:all 2s;border-radius:3px" onmouseover="this.style.transform='rotateY(-30deg) rotateX(-10deg)'" onmouseout="this.style.transform='rotateY(0deg) rotateX(0deg)'">
				<script>
					var cover_src=document.getElementById("interview_img").src;
				</script>
			</div>
			<div style="width:260px;height:450px;position:absolute;top:295px;border-radius:20px;opacity:0.5;background-color:#fff"></div>
			<div style="position:absolute;left:117.5px;top:260px;width:0;height:0;border-bottom:35px solid #fff;border-left:12px solid transparent;border-right:12px solid transparent;opacity:0.5"></div>
			<div style="width:260px;height:450px;position:absolute;top:295px;border-radius:20px">
				<p id="card_name" style="text-align:center;font-size:20px;font-family:text;font-weight:600;"></p>
				<p id="property" style="text-align:right;font-size:20px;font-family:text;font-weight:bolder;position:absolute;right:20px;top:0px"></p>
				<p id="stars" style="text-align:right;position:relative;top:-21px;right:20px;font-size:22px;color:#9b2d1b"></p>
				<p id="type" style="text-align:left;font-size:14px;font-family:微软雅黑;position:absolute;top:60px;left:20px"></p>
				<p id="value_text" style="font-size:14px;font-family:微软雅黑;position:absolute;top:85px;left:20px;right:20px"></p>
				<p id="attack_defend" style="text-align:right;font-size:14px;font-family:微软雅黑;position:absolute;bottom:0px;right:20px"></p>
			</div>
		</div>
    </div>
</body>
<script src="object.js"></script>
<script src="script.js"></script>
<script src="card_warehouse.js">正在加载卡片信息</script>
</html>